
<!DOCTYPE html>
<html>
  
  <head>
    <script type="text/javascript">
      // This function is called when the circle is clicked.


      function clickMe() {

        // Display the alert.
        
	   var svg = document.getElementById("svg");
	   var txt = svg.getElementById("text3970");
	   alert(txt);
	   txt.childNodes[0].nodeValue = "zloty kutacz";
	  // alert(txt.childNodes[0].nodeValue);

      }
	  
	  function animate(evt) {
    i
        svgDocument = document.getElementById("svg");

    arrow = svgDocument.getElementById("strzala");

    setTimeout("advance()", speed);
}

function advance() {
    if ( ++x > 90 ) x = 0;

    rect.setAttributeNS(null, "x", x);

    setTimeout("advance()", speed);
}
	  
	  
    </script>
  </head>
  
  <body onload=animation()>
    <h1>
      SVG User Interface
    </h1>
    <!-- Create the SVG pane. -->
    <svg onload="animate(evt)" height="1000" width="1000" id="svg">
	
	<script type="text/ecmascript" a3:scriptImplementation="Adobe"><![CDATA[
        var rect;
        var x = 0;
        var speed = 60;

        function animate(evt) {
            if ( window.svgDocument == null )
                svgDocument = evt.target.ownerDocument;

            
			lewo = svgDocument.getElementById("lewo").getElementsByTagName("polygon")
			dol = svgDocument.getElementById("dol").getElementsByTagName("polygon")

            setTimeout("advance()", speed);
        }

        function advance() {

            if ( ++x > 70 ) x  = 0;
				var pointslewo=(20-x)+",20 "+(0-x)+",10 "+(20-x)+",0";
				for (var i=0;i<lewo.length;i++){
					lewo[i].setAttributeNS(null, "points", pointslewo);
				}
            
            setTimeout("advance()", speed);
        }
    ]]></script>
	
      <!-- Create the circle. -->
	  <defs>
		    <linearGradient
			inkscape:collect="always"
			xlink:href="#linearGradient6726"
			id="linearGradient3081"
			x1="699.32861"
			y1="304.24323"
			x2="704.27838"
			y2="654.26105"
			gradientUnits="userSpaceOnUse"
			gradientTransform="matrix(1.274936,0,0,1.274936,-191.15828,86.64752)" />
			
			<linearGradient
       id="linearGradient6726">
      <stop
         style="stop-color:#00ffff;stop-opacity:1;"
         offset="0"
         id="stop6728" />
      <stop
         style="stop-color:#8080ff;stop-opacity:1;"
         offset="1"
         id="stop6730" />
    </linearGradient>
	  </defs>
	   <rect
       style="fill:#ff0000;fill-opacity:1;stroke:none"
       id="rect2996"
       width="401.28616"
       height="6.3617907"
       x="92.004646"
       y="258.72568" />
	   
	   
	       <rect
       style="fill:#ff0000;fill-opacity:1;stroke:none"
       id="rect2996"
       width="401.28616"
       height="6.3617907"
       x="92.004646"
       y="258.72568" />
    <rect
       style="fill:#ff0c00;fill-opacity:1;stroke:none"
       id="rect2996-1"
       width="291.02744"
       height="6.5378232"
       x="-551.04419"
       y="92.044197"
       transform="matrix(0,-1,1,0,0,0)" />
    <rect
       style="fill:#fff000;fill-opacity:1;stroke:none"
       id="rect2996-7"
       width="255.21579"
       height="6.6032739"
       x="118.40265"
       y="284.10367" />
    <rect
       style="fill:#ff3000;fill-opacity:1;stroke:none"
       id="rect2996-7-4"
       width="203.77077"
       height="6.7061348"
       x="144.17242"
       y="309.55099" />
    <rect
       style="fill:#ffc000;fill-opacity:1;stroke:none"
       id="rect2996-7-0"
       width="153.44244"
       height="6.8247991"
       x="169.28931"
       y="334.99039" />
    <rect
       style="fill:#ff6000;fill-opacity:1;stroke:none"
       id="rect2996-7-0-9"
       width="101.93179"
       height="6.9681449"
       x="194.90067"
       y="360.41742" />
    <rect
       style="fill:#ff9000;fill-opacity:1;stroke:none"
       id="rect2996-7-0-9-4"
       width="57.652901"
       height="7.1453686"
       x="214.07715"
       y="401.94812" />
    <rect
       style="fill:#ffa800;fill-opacity:1;stroke:none"
       id="rect2996-7-0-9-2"
       width="102.19876"
       height="6.9681449"
       x="169.52661"
       y="470.06189" />
    <rect
       style="fill:#ff4800;fill-opacity:1;stroke:none"
       id="rect2996-7-0-4"
       width="152.71362"
       height="6.8247991"
       x="144.11635"
       y="495.63232" />
    <rect
       style="fill:#ffd800;fill-opacity:1;stroke:none"
       id="rect2996-7-5"
       width="204.32123"
       height="6.7061353"
       x="118.35121"
       y="521.19031" />
    <rect
       style="fill:#ffe400;fill-opacity:1;stroke:none"
       id="rect3196"
       width="6.0206766"
       height="240.96248"
       x="118.69396"
       y="284.86472" />
    <rect
       style="fill:#ff3c00;fill-opacity:1;stroke:none"
       id="rect3196-5"
       width="6.1788459"
       height="191.41109"
       x="144.11356"
       y="310.35989" />
    <rect
       style="fill:#ffb400;fill-opacity:1;stroke:none"
       id="rect3196-5-1"
       width="6.3659959"
       height="141.51147"
       x="169.51875"
       y="335.30966" />
    <rect
       style="fill:#ff6c00;fill-opacity:1;stroke:none"
       id="rect3196-5-1-7"
       width="6.6124787"
       height="88.939171"
       x="194.89421"
       y="361.14053" />
    <rect
       style="fill:#ff7800;fill-opacity:1;stroke:none"
       id="rect2996-7-0-9-4-1"
       width="26.023327"
       height="7.2957501"
       x="194.89268"
       y="442.94232" />
    <rect
       style="fill:#ff8400;fill-opacity:1;stroke:none"
       id="rect3196-5-1-7-1"
       width="6.872323"
       height="48.067352"
       x="214.04933"
       y="401.93396" />
    <rect
       style="fill:#ff9c00;fill-opacity:1;stroke:none"
       id="rect3196-5-1-7-5"
       width="6.6943297"
       height="74.532372"
       x="265.04108"
       y="402.28021" />
    <rect
       style="fill:#ffcc00;fill-opacity:1;stroke:none"
       id="rect3196-5-1-2"
       width="6.177289"
       height="191.86488"
       x="316.04861"
       y="335.40405" />
    <rect
       style="fill:#ff5400;fill-opacity:1;stroke:none"
       id="rect3196-5-1-7-7"
       width="6.3697395"
       height="140.60454"
       x="290.45361"
       y="361.26184" />
    <rect
       style="fill:#ff1800;fill-opacity:1;stroke:none"
       id="rect2996-7-5-1"
       width="255.87677"
       height="6.6032739"
       x="92.062019"
       y="546.74048" />
    <rect
       style="fill:#ff2400;fill-opacity:1;stroke:none"
       id="rect3196-4"
       width="6.021585"
       height="240.65759"
       x="341.93475"
       y="311.80453" />
    <path
       style="fill:#ffff00;fill-opacity:1;stroke:none;display:inline"
       d="m 367.44819,284.31399 0,67.69113 0.0797,0 0,0.0797 125.54136,0 0,-6.01611 -119.60494,0 0,-61.75471 -6.0161,0 z"
       id="rect3196-4-2"
       inkscape:connector-curvature="0" />
    <rect
       style="fill:none;stroke:#000000;stroke-width:1.27423227"
       id="rect6782"
       width="126.21938"
       height="119.84469"
       x="492.07285"
       y="244.05716" />
    <rect
       style="fill:none;stroke:#000000;stroke-width:1.28303504;stroke-miterlimit:4;stroke-dasharray:none"
       id="rect6795"
       width="126.21097"
       height="205.14343"
       x="492.07751"
       y="367.13538" />
    <path
       style="fill:url(#linearGradient3081);fill-opacity:1;stroke:none;display:inline"
       d="m 618.92932,344.1563 0,6.37468 82.831,0 0,485.43189 6.41452,0 0,-485.43189 0,-6.37468 0,-0.0398 c -30.76962,0.0574 -62.74798,0.0411 -89.24552,0.0398 z"
       id="rect2996-7-0-9-2-5"
       inkscape:connector-curvature="0"
       sodipodi:nodetypes="ccccccccc" />
    <path
       style="fill:url(#linearGradient3089);fill-opacity:1;stroke:none;display:inline"
       d="m 618.80979,267.66014 0,6.37468 95.73973,0 0,561.92805 6.41452,0 0,-568.30273 c -34.05141,0 -68.10283,0 -102.15425,0 z"
       id="rect2996-7-0-9-2-5-2-1"
       inkscape:connector-curvature="0"
       sodipodi:nodetypes="ccccccc" />
    <path
       sodipodi:type="arc"
       style="fill:#8080ff;fill-opacity:1;stroke:none"
       id="path3071"
       sodipodi:cx="694.37006"
       sodipodi:cy="694.77136"
       sodipodi:rx="10.911633"
       sodipodi:ry="4.8777165"
       d="m 705.28169,694.77136 a 10.911633,4.8777165 0 0 1 -21.8232,0.017 l 10.91157,-0.017 z"
       sodipodi:start="0"
       sodipodi:end="3.138102"
       transform="matrix(0.88049642,0,0,1.3032679,99.966035,-70.068677)" />
    <rect
       style="fill:none;stroke:#000000;stroke-width:5.15103865;stroke-miterlimit:4;stroke-dasharray:none"
       id="rect3091"
       width="715.18781"
       height="456.1254"
       x="-753.56665"
       y="-612.65924"
       transform="scale(-1,-1)" />

    <path
       sodipodi:type="star"
       style="fill:none;stroke:#000000;stroke-width:2.75663924;stroke-miterlimit:4;stroke-dasharray:none"
       id="path3881"
       sodipodi:sides="3"
       sodipodi:cx="50.204582"
       sodipodi:cy="-64.159416"
       sodipodi:r1="79.463829"
       sodipodi:r2="158.92766"
       sodipodi:arg1="0.52359878"
       sodipodi:arg2="1.5707963"
       inkscape:flatsided="false"
       inkscape:rounded="0"
       inkscape:randomized="0"
       d="M 119.02228,-24.427501 50.204586,94.768242 -18.613113,-24.427502 -87.430809,-143.62324 l 137.635392,-1e-5 137.635387,0 z"
       inkscape:transform-center-y="-51.245521"
       transform="matrix(1.4464147,-0.55849221,2.5052639,0.32244563,488.15791,154.83711)"
       inkscape:transform-center-x="199.07786" />
    <rect
       style="fill:#b3b3b3;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
       id="rect3884"
       width="40.393475"
       height="18.561552"
       x="569.04419"
       y="335.00235" />
    <rect
       style="fill:#0000ff;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
       id="rect3886"
       width="13.435029"
       height="6.3639612"
       x="590.08063"
       y="338.89145" />
    <rect
       style="fill:#cccccc;fill-opacity:1;stroke:none"
       id="rect3896"
       width="129.83914"
       height="72.124893"
       x="94.752312"
       y="169.89293" />
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="159.37619"
       y="188.9848"
       id="text3888"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3890"
         x="102.53048"
         y="188.9848"
         style="text-anchor:middle;text-align:center;font-size:16px">Temperatura</tspan><tspan
         sodipodi:role="line"
         x="102.53048"
         y="213.9848"
         id="tspan3930"
         style="text-anchor:middle;text-align:center;font-size:16px">w domu</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="150"
       y="237.36218"
       id="text3892"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3894"
         x="150"
         y="237.36218">23</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="455"
       y="186.36218"
       id="text3898"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         x="455"
         y="186.36218"
         id="tspan3902"
         style="font-size:16px;text-align:center;text-anchor:middle">Ogrzewanie</tspan><tspan
         sodipodi:role="line"
         x="455"
         y="206.36218"
         id="tspan3910"
         style="font-size:16px;text-align:center;text-anchor:middle">podłogowe</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="450"
       y="242.36218"
       id="text3904"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3906"
         x="450"
         y="242.36218">55</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="450"
       y="332.36218"
       id="text3932"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3934"
         x="450"
         y="332.36218">27</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="520"
       y="282.36218"
       id="text3936"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3938"
         x="520"
         y="282.36218"
         style="font-size:16px">Sprężarka</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="520"
       y="322.36218"
       id="text3940"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3942"
         x="520"
         y="322.36218">33</tspan></text>
    <rect
       style="fill:#cccccc;fill-opacity:1;stroke:none;display:inline"
       id="rect3896-2"
       width="109.33914"
       height="72.124893"
       x="501.25232"
       y="428.39291" />
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="520"
       y="452.36218"
       id="text3944"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3946"
         x="520"
         y="452.36218"
         style="font-size:16px">CWU</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="520"
       y="487.36218"
       id="text3948"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3950"
         x="520"
         y="487.36218">55</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:16px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="640"
       y="203.83405"
       id="text3970"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3972"
         x="640"
         y="203.83405">Glikol</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="649.12402"
       y="242.36218"
       id="text3974"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3976"
         x="649.12402"
         y="242.36218">10</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:20px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="650"
       y="332.36218"
       id="text3978"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3980"
         x="650"
         y="332.36218">5</tspan></text>
<g id="lewo">
    
 <polygon
       id="poly"
       points="0,10 20,0 20,20 "
       style="fill:#000000;stroke:none"
       transform="translate(454.64883,252.26034)" />
    <polygon
       id="poly-8"
       points="0,10 20,0 20,20 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(303.819,302.8622)" />
    <polygon
       id="poly-8-4"
       points="20,20 0,10 20,0 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(270.61969,354.33707)" />
    <polygon
       id="poly-5"
       points="0,10 20,0 20,20 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(384.649,252.26034)" />
    <polygon
       id="poly-5-5"
       points="20,20 0,10 20,0 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(314.649,252.26034)" />
    <polygon
       id="poly-8-1-1"
       points="0,10 20,0 20,20 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(233.819,302.8622)" />
    <polygon
       id="poly-5-5-7"
       points="20,20 0,10 20,0 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(244.649,252.26034)" />
    <polygon
       id="poly-5-5-7-6"
       points="20,20 0,10 20,0 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(174.649,252.26034)" />
    <polygon
       id="poly-8-4-4"
       points="20,20 0,10 20,0 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(244.81801,463.86219)" />
    <polygon
       id="poly-8-4-4-3"
       points="20,0 20,20 0,10 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(281.13522,514.74088)" />
    <polygon
       id="poly-8-4-4-3-1"
       points="20,0 20,20 0,10 "
       style="fill:#000000;stroke:none;display:inline"
       transform="translate(211.135,514.74088)" />
	
	   </g>
	   
	    <g
       id="dol"
       inkscape:label="#g3952">
      <polygon
         transform="matrix(0,-1,1,0,85.999997,310.8622)"
         id="poly-5-5-7-6-8"
         points="0,10 20,0 20,20 "
         style="fill:#000000;stroke:none;display:inline" />
      <polygon
         transform="matrix(0,-1,1,0,85.999997,380.86218)"
         id="poly-5-5-7-6-8-5"
         points="0,10 20,0 20,20 "
         style="fill:#000000;stroke:none;display:inline" />
      <polygon
         transform="matrix(0,-1,1,0,85.999997,450.86218)"
         id="poly-5-5-7-6-8-5-7"
         points="0,10 20,0 20,20 "
         style="fill:#000000;stroke:none;display:inline" />
    </g>
	   
	   
    </svg>
    <p>
      Click on the gold circular user interface element.
    </p>
  </body>

</html>